<%--
  Created by IntelliJ IDEA.
  User: ASUS
  Date: 2022/1/12
  Time: 15:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>日志管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css"/>
    <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
    <script src="${pageContext.request.contextPath}/echarts/echarts.js"></script>
    <script src="${pageContext.request.contextPath}/echarts/jquery-2.1.0.js"></script>
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>查询条件</legend>
</fieldset>

<%--头部搜索栏--%>
<form class="layui-form" action="">

        <div class="layui-inline">
            <label class="layui-form-label">登陆名称：</label>
            <div class="layui-input-inline">
                <input type="text" name="loginname"  autocomplete="off" class="layui-input">
            </div>
        </div>
    <div class="layui-inline" style="float: left">
        <label class="layui-form-label">时间范围</label>
        <div class="layui-input-inline" style="width: 300px">
            <input type="text" class="layui-input" id="logintime" name="logintime" placeholder=" - ">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-inline">
            <button type="button" class="layui-btn" lay-submit="" lay-filter="search"><i class="layui-icon layui-icon-search"></i>查询</button>
            <button type="reset" class="layui-btn layui-btn-primary"><i class="layui-icon layui-icon-close"></i>重置</button>
        </div>
    </div>
</form>


<table id="test" lay-filter="test"></table>

<%--头部工具栏--%>
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="dels">批量删除</button>
    </div>
</script>

<script type="text/html" id="information">
    <button type="button" class="layui-btn layui-btn-normal layui-btn-sm" lay-event="del">删除</button>
</script>


<script>
    layui.use(['table','form','jquery','layer','laydate'], function() {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;
        var layer = layui.layer;
        var laydate = layui.laydate;

        ////监听行工具事件
        table.on('tool(test)',function (obj) {
            var data = obj.data
                , $ = layui.jquery
                , form = layui.form
                , event = obj.event;

            if(event==='del'){
                if( 1==${sessionScope.user.type}){
                    layer.confirm('真的要删除行么', function(index){
                        $.ajax({
                            url: "${pageContext.request.contextPath}/log/deletelog",
                            data: obj.data,
                            type: "post",
                            success: function(result){
                                if(result.code===2000){
                                    //关闭弹窗
                                    layer.closeAll();
                                    //弹出一号表情
                                    layer.msg(result.msg,{icon: 1});
                                    //刷新表格
                                    table.reload('test');
                                }else{
                                    layer.msg(result.msg,{icon:5});
                                }
                            },
                            dataType:"json"
                        })
                    })
                }else {
                    layer.msg("你没有这个权限！！")
                }
            }
        });

        //监听头部工具栏
        table.on('toolbar(test)',function (obj) {
            var event=obj.event;
            var checkStatus = table.checkStatus(obj.config.id);
             if (event==='dels'){
                if (checkStatus.data.length>0){
                    var data = checkStatus.data;
                    var flag=1;
                    var aaa=${sessionScope.user.type};
                    $.each(data,function (i) {
                        if(1!=aaa) {
                            flag = 0;
                            layer.msg("对不起,你没有权限")
                        }
                    })
                    if (flag==1){
                        layer.confirm('进行批量删除吗？', function(index){
                            $.ajax({
                                url: "${pageContext.request.contextPath}/log/dels",
                                type:"post",
                                dataType: "json",
                                // contentType:'application/json;charset=utf-8',
                                data:{"log":JSON.stringify(data)},
                                //将一个 JavaScript 对象或值转换为 JSON 字符串
                                success: function (result) {
                                    layer.closeAll();
                                    if (result.code==2000) {
                                        //重载表格
                                        table.reload("test");
                                        layer.msg(result.msg);
                                    } else {
                                        layer.msg(result.msg);
                                    }
                                }
                            });
                        });
                    }

                } else {
                    alert("请选择要批量删除的日志！")
                }
            }
        });


        //添加表单的搜索监听事件
        form.on('submit(search)', function (data) {
            //表格数据重新渲染。
            table.reload('test', {
                page: {
                    curr: 1 //重新从第 1 页开始
                },
                where: { //按照什么进行查找
                    "logintime": data.field.logintime,
                    "loginname": data.field.loginname
                }
            })
        });

        //日期时间范围
        laydate.render({
            elem: '#logintime'
            , type: 'datetime'
            , range: true
        });

        table.render({
            elem: '#test'
            ,id:'test'
            ,url:'${pageContext.request.contextPath}/log/getallLogmsg'
            ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
            ,title: '登陆日志表'
            ,text:{
                none:"暂无登陆日志信息～"
            }
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'id', title:'ID',fixed: 'left'}
                ,{field:'loginname', title:'登陆名称'}
                ,{field:'loginip', title:'登陆IP'}
                ,{field:'logintime', title:'登录时间'}
                ,{field:'information', title:'详情',templet: '#information'}
            ]]
            ,page:true,//开启分页
            limit:5,//默认每页显示的条数
            limits:[5,10,15,20],//自定义分页条数的选择
        });

    });

</script>
</body>
</html>
